<template>
  <div>
    <!--条件筛选-->
    <TopFilter ref="topFilter" :list="topFilterList" :cols="3" labelWidth="110" @filterChange="changeHandle" @onCollapse="collapseHandle"></TopFilter>
    <button-area :style="{ paddingLeft: '80px' }"></button-area>
    <FilterTable
      ref="table"
      columnsRef="testindex"
      :columns="columns"
      :fetchapi="fetchApi"
      :isSelectColumn="false"
      :params="fetchParams"
      :datakey="'records'"
      :onColumnsChange="columns => (this.columns = columns)"
      :onRowSelectChange="selectData"
      :isExportExcel2="true"
      :exportFileName="'备件订单进度明细.xlsx'"
    >
    <template slot="controls">
      <el-button size="small" type="primary" :loading="downloading" @click="detailExportClick">明细导出</el-button>
    </template>
    </FilterTable>
    <Drawer :visible.sync="visibleDrawer" :title="title" width="80vw" destroyOnClose :containerStyle="{ height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px' }">
      <carrierTrace v-model="initData" :type="handleType" :rowData="formData" @close="infoClose" />
    </Drawer>
    <!-- <BaseDialog title="服务站查询" :visible.sync="isShowSearchCustomer" destroyOnClose :containerStyle="{ height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px' }">
      <SearchCustomer :customerNo="kehuxuanze" @close="isShowSearchCustomer = false" @addCustomerCode="confirmSearchCustomer" />
    </BaseDialog> -->

      <BaseDialog
      :visible.sync="issearch"
      :title="'服务商查询'"
      destroyOnClose
      :containerStyle="{height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px'}"
    >
      <ownerSeacher  @close="dealercloseHandler" />
    </BaseDialog>
  </div>
</template>

<script>
  import { dictionary } from '@/utils/dictMixin';
  import { getShipmentData,exporturl,detailExport} from '@/api/partsmanage/sparepartTrace/query';
  import carrierTrace from './carrierTrace';
  import SearchCustomer from './SearchCustomer';
  import { exportFile } from '@/utils/index';
  import { banWord} from '@/utils/validate';
  import { ddztArr,ddfyArr,ddckArr,ddfhArr,dddtArr } from './constant';
import ownerSeacher from '@/pages/partsmanage/claim/approve/ownerSeacher';
  export default {
    name: 'carrierTraceRepairindex',
    components: { carrierTrace,SearchCustomer,ownerSeacher},
    mixins: [dictionary],
    data() {
      return {
        topFilterList: this.createTopFilterList(),
        fetchParams: { xhrAbort: true },
        columns: this.createTableColumns(),
        fetchApi: getShipmentData,
        dealerCode: '',
        kehuxuanze: '',
        visibleDrawer: false,
        visibleImportPeij: false,
        isShowSearchCustomer: false,
        handleType: '',
        initData: {},
        formData: {},
        wsNameList:[],
      issearch: false,
      downloading: false,
      title: "",
      }
    },
    mounted() {
      // 分页
      this.BaseTable = this.$refs.table.$refs.pageTable;
      this.queryAllWsName();
    },



    methods: {
      /**
       * 备件订单明细导出
       */
      detailExportClick(){
        this.downloading = true;
        detailExport(this.fetchParams).then(res => {
          exportFile(res.data, '备件订单明细.xls');
          this.downloading = false;
        }).catch(res =>{
          this.downloading = false;
        });
      },
      seacherFun(){
        this.issearch = true
      },
      dealercloseHandler(val){
        if(val){
          this.topFilterList.find(x=>x.fieldName=='dealerCode').initialValue=val.dealerCode;
          this.topFilterList.find(x=>x.fieldName=='dealerName').initialValue=val.dealerShortname;
        }
        this.issearch=false;
      },
      createTopFilterList() {
        return [
          {
            type: 'INPUT',
            label: '服务商代码',
            fieldName: 'dealerCode',
            placeholder: '请选择',
            unitRender: () => {
              return (
                <div>
                  <el-button icon="el-icon-search" onClick={() => this.seacherFun()}></el-button>
                </div>
              );
            }
          },
          {
            type: 'INPUT',
            label: '服务商简称',
            fieldName: 'dealerName',
            placeholder: '请输入',
          },
          {
            type: 'INPUT',
            label: '备件订单号:',
            fieldName: 'XSDDHM',
            rules: [{validator: banWord, trigger: 'blur' },{max: 20, message: '长度在20个字符以内', trigger: 'blur' }],
          },
          {
            type: 'SELECT',
            label: '订单类型:',
            fieldName: 'XSDDLX',
            // itemList: this.createDictList('3003'),
            itemList:dddtArr,
            placeholder: '请选择'
          },
          {
            type: 'RANGE_DATE',
            label: '提报日期',
            initialValue: '',
            fieldName: 'startDate|endDate',
            valueFormat: 'yyyy-MM-dd',
            placeholder: '请选择'
          },
          {
            type: 'SELECT',
            label: '订单状态:',
            fieldName: 'XSDDZT',
            itemList: ddztArr,
            placeholder: '请选择'

          },
          {
            type: 'RANGE_DATE',
            label: '审核日期',
            initialValue: '',
            fieldName: 'startTime|endTime',
            valueFormat: 'yyyy-MM-dd',
            placeholder: '请选择'
          },
          {
            type: 'SELECT',
            label: '出库状态:',
            fieldName: 'DDCKZT',
            itemList: ddckArr,
            placeholder: '请选择'
          },
          {
            type: 'INPUT',
            label: '交货单号:',
            fieldName: 'SAPPO',
            hidden:true
          },
          {
            type: 'SELECT',
            label: '发运状态:',
            fieldName: 'XSDJZT',
            itemList: ddfyArr,
            placeholder: '请选择'
          },

        ]
      },
      createTableColumns() {
        return [
          {
            title: '序号',
            dataIndex: 'index',
            width: 70,
            fixed: 'left',
            sorter: true,
            render: props => {
              return <span>{props.row.index + 1}</span>;
            }
          },
          {
            title: '操作',
            dataIndex: 'column-action',
            width: 50,
            fixed: 'left',
            render: (props, h) => {
              return (
                <div>
                <multiuse-button  size="mini" type="text" onClick={() => this.editHandle(props.row, 'edit')}>
              明细
              </multiuse-button>
              </div>
            );
            }
          },
          {
            title: '服务商代码',
            dataIndex: 'DEALER_CODE',
            sorter: true,
          },
          {
            title: '服务商名称',
            dataIndex: 'DEALER_NAME',
            sorter: true,
            width: 200
          },
          {
            title: '备件订单号',
            dataIndex: 'XSDDHM',
            sorter: true,
            width: 185
          },
          {
            title: '交货单号',
            dataIndex: 'BSYSDH',
            sorter: true,
            hidden: true,
            width: 180
          },
          {
            title: '是否延期',
            dataIndex: 'IS_DELAY_ORDER',
            sorter: true,
            dictItems: this.createDictList('1004'),
            // render: props => {
            //   if(props.row.totalbstxsl===props.row.totalbjfysl){
            //     return '否';
            //   }else{
            //     return '是';
            //   }
            // }
          },
          {
            title: '订单类型',
            dataIndex: 'XSDDLX',
            sorter: true,
            dictItems: this.createDictList('3003'),
            // render: props => {
            //   return <span>{this.createDictText(props.row.XSDDLX, '3003')}</span>;
            // }
          },
          {
            title: '订单状态',
            dataIndex: 'XSDDZT',
            sorter: true,
            dictItems: this.createDictList('3002'),
            // render: props => {
            //   return <span>{this.createDictList(props.row.XSDDZT, '3002')}</span>;
            // }
          },
          {
            title: '出库状态',
            dataIndex: 'chukustaus',
            sorter: true,
            dictItems: ddckArr,
            // render: props => {
            //   return <span>{this.createDictText(props.row.chukustaus, '3015')}</span>;
            // }
          },
          {
            title: '发运状态',
            dataIndex: 'fayustatus',
            sorter: true,
            dictItems: ddfyArr,
            // render: props => {
            //   return <span>{this.createDictText(props.row.fayustatus, '3014')}</span>;
            // }
          },

          {
            title: '订单数量',
            dataIndex: 'BSZSLS',
            sorter: true,
          },
          {
            title: '订单金额',
            dataIndex: 'XSYSJE',
            sorter: true,
            precision: 2,
            numberFormat: true,
            width: 180
          },
          {
            title: '出库数量',
            dataIndex: 'STOCK_OUT_SUM',
            sorter: true,
            width: 180
          },
          {
            title: '出库金额',
            dataIndex: 'STOCK_OUT_AMOUNT',
            sorter: true,
            precision: 2,
            numberFormat: true,
            width: 180,
          },
          {
            title: '提报时间',
            dataIndex: 'DDTBSJ',
            dateFormat: 'yyyy-MM-dd HH:mm:ss',
            sorter: true,
            width: 150
          },
          {
            title: '审核人',
            dataIndex: 'AUDIT_BY_NAME',
            sorter: true,
            width: 180,
          },
          {
            title: '审核时间',
            dataIndex: 'AUDIT_TIME',
            dateFormat: 'yyyy-MM-dd HH:mm:ss',
            sorter: true,
            width: 150
          },
          {
            title: '出库时间',
            dataIndex: 'STOCK_OUT_DATE',
            dateFormat: 'yyyy-MM-dd HH:mm:ss',
            sorter: true,
            width: 150
          },
          {
            title: '签收时间',
            dataIndex: 'SIGN_IN_DATE',
            dateFormat: 'yyyy-MM-dd HH:mm:ss',
            sorter: true,
            width: 150
          },
          {
            title: '入库时间',
            dataIndex: 'STOCK_IN_DATE',
            dateFormat: 'yyyy-MM-dd HH:mm:ss',
            sorter: true,
            width: 150
          },
          {
            title: '发运方式',
            dataIndex: 'DDFYFS',
            sorter: true,
            dictItems: ddfhArr,
          },
          {
            title: '收货地址',
            dataIndex: 'XXSHDZ',
            sorter: true,
            width: 180,
          },
          {
            title: '创建人',
            dataIndex: 'CREATED_BYNAME',
            sorter: true,
            width: 180,
          },
          {
            title: '订单来源',
            dataIndex: 'BSDDLX',
            sorter: true,
            width: 180,
            // dictItems: this.createDictList('3043'),
            // render: props => {
            //   if(props.row.BSDDLX===1){
            //     return '服务商提报';
            //   }else{
            //     return '总部代提报';
            //   }
            // }
          },
          {
            title: '备注',
            dataIndex: 'XSDDBZ',
            hidden: true
          }
        ]
      },
      editHandle(row, type) {
        this.title = '备件订单跟踪明细';
        this.formData = row;
        this.handleType = type;
        this.visibleDrawer = true;
      },
      changeHandle(val) {
        // this.fetchParams = Object.assign({}, val);
        val.endTime && (val.endTime = val.endTime.split(' ')[0] + ' 23:59:59');
        this.fetchParams = Object.assign({},val);
        console.info(this.fetchParams)
      },
      collapseHandle() {
        this.$nextTick(() => {
          this.BaseTable.EXECUTE_RESET_HEIGHT();
        });
      },
      async queryAllWsName() {
        let res = await compareWsName();
        var li=JSON.stringify(res,["data"]);
        var kds=JSON.parse(li);
        this.wsNameList=kds.data;
      },
      openimportPjDialog() {
        this.visibleImportPeij = true;
      },
      selectData(val) {
        this.tableData = val;
      },
      comuput(data){
        const lid= this.accDiv(data.row.XSYSJE,data.row.BSZSLS);
        const totalmeuy=this.accMul(lid,data.row.fytotal);
       return totalmeuy;
      },
       accDiv(arg1, arg2){
        let t1 = 0
        let t2 = 0
        let r1, r2
        try { t1 = arg1.toString().split('.')[1].length } catch (e) { }
        try { t2 = arg2.toString().split('.')[1].length } catch (e) { }
        r1 = Number(arg1.toString().replace('.', ''))
        r2 = Number(arg2.toString().replace('.', ''))
        let intDiv = r1 / r2
        let pow = Math.pow(10, t2 - t1);
        return this.accMul(intDiv, pow) // 这里用上面定义好的乘法运算
      },
     accMul(arg1, arg2){
        let m = 0
        const s1 = arg1.toString()
        const s2 = arg2.toString()
        try { m += s1.split('.')[1].length } catch (e) { }
        try { m += s2.split('.')[1].length } catch (e) { }
       return  Number(s1.replace('.', '')) * Number(s2.replace('.', '')) / Math.pow(10, m)
      },
      async confirmSearchCustomer(row) {
        console.log(row, 'rowCustomer');
        this.rowData = row[0];
        console.log('row[0].dealerCode', row[0].dealerCode);
        this.topFilterList.find(x => x.fieldName == 'ownerCode').initialValue = row[0].dealerCode;
        this.topFilterList.find(x => x.fieldName == 'ownerName').initialValue = row[0].dealerShortname;
      },
      async exportClick() {
        let json = Object.assign({}, { CODE: 'CODE_00000263' }, this.fetchParams);
        let res = await exporturl(json);
        if (res.resultCode == 200) {
          this.$router.push('/admin/auth/oem/downloadCenter');
        }
      },
      infoClose(rData) {
        this.visibleDrawer = false;
        if (rData.type === 'refresh') {
          // 重新加载
          this.fetchParams = { ...this.fetchParams };
        }
      }
    }
  }
</script>
